{% extends 'back/index.html' %}

{% block content %}
    <div class="rt_content">
        <div class="page_title">
            <h2 class="fl">订单列表</h2>
        </div>
		<script type="text/javascript">
            jQuery(document).ready(function ($) {
                $("#example-1").dataTable({
                    aLengthMenu: [
                        [10, 25, 50, 100, -1], [10, 25, 50, 100, "全部"]
                    ],
                    language: {
                        "info": "显示_START_至_END_项结果，共_TOTAL_项",
                        "search": "搜索:",
                        "paginate": {"previous": "上一页", "next": "下一页"},
                        "lengthMenu": "显示 _MENU_ 项",
                        "zeroRecords": "抱歉，没有找到符合条件的记录"
                    }
                });
                $("#example-1").wrapAll("<div style='overflow-x:scroll'>");
            });
        </script>
		<table id="example-1" class="table table-striped table-bordered" cellspacing="0" width="80%"
               style="white-space: nowrap;">
            <thead>
            <tr>
                <th>订单编号</th>
				<th>订单状态</th>
                <th>收件人</th>
                <th>联系电话</th>
                <th>收件人地址</th>
                <th>订单金额</th>
                <th>配送方式</th>
                <th>操作</th>
            </tr>
            </thead>
            <tbody>
            {% for o in order %}
                <tr>
                    <td class="center">{{ o.order_id }}</td>
                    <td class="center">{{ o.status }}</td>
                    <td class="center">{{ o.user }}</td>
                    <td class="center">{{ o.phone }}</td>
                    <td class="center">
                        {{ o.add }}
                    </td>
                    <td class="center"><strong class="rmb_icon">{{ o.money }}</strong></td>
                    <td class="center">申通快递</td>
                    <td class="center">
                        <a href="{% url 'order_detail' %}?id={{ o.order_id }}" title="查看订单" class="link_icon">&#118;</a>
                        <a href="#" title="删除" class="link_icon">&#100;</a>
                    </td>
                </tr>
            {% endfor %}
			</tbody>
		</table>
    </div>

    <script>
        (function ($) {
            $(window).load(function () {
                $('#drop2').collapse('show');
                $('#2-1').addClass('active');
            });
        })(jQuery);
    </script>

{% endblock %}
